<template>
  <div class="home-list-wrapper">
    <template v-for="(item, index) in cartList">
      <ul :key="index">
        <li>
          <img :src="item.img" alt />
        </li>
        <li>{{item.city}}</li>
        <li>
          <span class="add-btn" @click="toCart(item, index)">+</span>
        </li>
      </ul>
    </template>
  </div>
</template>

<script>
export default {
  props: {
    cartList: {
      type: Array,
    },
  },
  methods: {
    toCart(item, index) {},
  },
};
</script>

<style lang="scss" scoped>
.add-btn {
  display: inline-block;
  padding: 5px 20px;
  // width: 60px;
  // height: 60px;
  background: lightcoral;
  border-radius: 5px;
  font-size: 35px;
  color: white;
  // margin: 5px;
}
</style>